Welcome to UQRUG!
Use R Markdown to publish a group of related data visualizations as a dashboard.
Support for a wide variety of components including htmlwidgets; base, lattice, and grid graphics; tabular data; gauges and value boxes; and text annotations.
Flexible and easy to specify row and column-based layouts. Components are intelligently re-sized to fill the browser and adapted for display on mobile devices.
Storyboard layouts for presenting sequences of visualizations and related commentary.
Optionally use Shiny to drive visualizations dynamically.
Optionally use bslib to easily customize main colors, fonts, and more.
Learn more about flexdashboard: https://pkgs.rstudio.com/flexdashboard
This section allows you to provide a side section for commentary on the left panel.
You can insert text, and R code here to display outputs. Even a map!
You can put pages in dropdowns
And link to other pages, such as
Dashboard or any
other page
Click on a country to select it. Double click to deselect.
You can select one, or multiple points
You can also have a panel that just has text in it too.
---
title: "Flexdashboard example"
output:
flexdashboard::flex_dashboard:
vertical_layout: fill
navbar:
- { title: "UQRUG", href: "https://uqrug.netlify.app/", align: left }
social: [ "menu" ]
source_code: embed
theme: cosmo
---
<style>
.box1 {
background-color: rgba(39, 128, 227, 0.7);
color: white;
font-size: 38px;
}
.box2 {
background-color: rgba(255, 117, 24, 0.7);
color: white;
font-size: 38px;
}
</style>
```{r setup, include=FALSE}
library(flexdashboard)
library(dplyr)
library(DT)
library(crosstalk)
library(plotly)
library(tmap)
library(summarywidget)
```
# Flex Intro and Map {data-navmenu="Introduction" .storyboard}
Welcome to UQRUG!
### Flexdashboard Frames
The goal of <strong>flexdashboard</strong> is to make it easy to create interactive dashboards for R, using R Markdown.</p>
<ul>
<li><p>Use <a href="https://rmarkdown.rstudio.com" class="external-link">R Markdown</a> to publish a group of related data visualizations as a dashboard.</p></li>
<li><p>Support for a wide variety of components including <a href="https://www.htmlwidgets.org" class="external-link">htmlwidgets</a>; base, lattice, and grid graphics; tabular data; gauges and value boxes; and text annotations.</p></li>
<li><p>Flexible and easy to specify row and column-based <a href="https://pkgs.rstudio.com/flexdashboard/articles/layouts.html">layouts</a>. Components are intelligently re-sized to fill the browser and adapted for display on mobile devices.</p></li>
<li><p><a href="https://pkgs.rstudio.com/flexdashboard/articles/using.html#storyboards-1">Storyboard</a> layouts for presenting sequences of visualizations and related commentary.</p></li>
<li><p>Optionally use <a href="https://shiny.rstudio.com" class="external-link">Shiny</a> to drive visualizations dynamically.</p></li>
<li><p>Optionally use <a href="https://rstudio.github.io/bslib/" class="external-link">bslib</a> to easily <a href="https://pkgs.rstudio.com/flexdashboard/articles/theme.html">customize main colors, fonts, and more</a>.</p></li>
</ul>
<p>Learn more about <strong>flexdashboard</strong>: <a href="https://pkgs.rstudio.com/flexdashboard" class="uri">https://pkgs.rstudio.com/flexdashboard</a></p>
***
This section allows you to provide a side section for commentary on the left panel.

### A Map Frame
You can insert text, and R code here to display outputs. Even a map!
```{r}
library(leaflet)
leaflet() %>%
addTiles() %>%
addMarkers(lng=153.01374, lat=-27.49617, popup="The location of today's UQRUG")
```
# Link Examples {data-navmenu="Introduction"}
You can put pages in dropdowns
<br>
And link to other pages, such as [Dashboard] or [any other page](#flex-intro-and-map)
Dashboard {data-icon="fa-list" data-orientation=rows}
=====================================
Column {.sidebar}
-----------------------------------------------------------------------
This is a separate sidebar column where we can add interactive content. This could be Shiny based, but in this case is using Crosstalk.
```{r}
# loading data and cleaning it
data(World)
World <- filter(World, iso_a3 != "ATA" & iso_a3 != "ATF") %>%
mutate(area = round(area),
pop_est_dens = round(pop_est_dens),
gdp_cap_est = round(gdp_cap_est))
wsd <- SharedData$new(World)
# crosstalk input functions
filter_slider("gdp_cap_est", "GDP per cap ", wsd, ~gdp_cap_est, width = "100%", min = 0)
filter_checkbox("continent", "Continent", wsd, ~continent, inline = TRUE)
filter_select("income_grp", "Income Group", wsd, ~income_grp)
```
Row
-----------------------------------------------------------------------
### Interactive Map
```{r}
plot_geo(wsd, text = ~paste(name, "<br />", "Life Exp:", life_exp, "<br />", "GDP per cap:", round(gdp_cap_est)), hoverinfo = 'text', color = ~continent, showlegend=FALSE, fill='tonext') %>% layout(margin = list(l = 2, r = 2, t = 2, b = 2)) %>%
highlight("plotly_click")
```
> Click on a country to select it. Double click to deselect.
### Histogram of World life expectancy
```{r}
plot_ly(wsd) %>%
add_trace(x = ~life_exp, color = ~continent, type="histogram")%>% layout(barmode = "stack") %>%
highlight("plotly_selected")
```
Row
-----------------------------------------------------------------------
### GDP vs Life Exp Scatterplot
```{r}
plot_ly(wsd) %>%
add_trace(x = ~gdp_cap_est, y = ~life_exp, color = ~continent, size = ~pop_est, type="scatter",text = ~paste(name, "<br />", "Life Exp:", life_exp, "<br />", "GDP per cap:", round(gdp_cap_est)), hoverinfo = 'text')%>%
layout(xaxis = list(type = "log")) %>%
highlight("plotly_selected")
```
> You can select one, or multiple points
### Interactive Datatable
```{r}
datatable(wsd, class = "compact",options=list(
pageLength = 5,
lengthMenu = c(5, 10, 15))) %>%
formatStyle( 0, target= 'row', lineHeight='80%')
```
Row {data-height=150}
-----------------------------------------------------------------------
### Mean Life Expectancy {.box1}
```{r}
summarywidget(wsd, statistic='mean', column='life_exp', digits=1)
```
### Total GDP {.box2}
```{r}
summarywidget(wsd, statistic='sum', column='gdp_cap_est', digits=0)
```
### Country Count {.box1}
```{r}
summarywidget(wsd, statistic='count', column='name')
```
### Text Box {.box2}
You can also have a panel that just has text in it too.